<!-- 商品列表组件 <pd-list :list="xx"></pd-list> -->
<template>
	<view class="pd-list">
		 <view class="pd-li goodItem" v-for="(item,index) in list" @tap="goInfo(item.id)" :key='index' :id='item.id'>
			<view class="good_img">
				<image :src="item.imageMain" class='imgSize'>
			</view>
			<view class="good_info">
				<view class="good_tittle">{{item.goodsName}}</view>
				<view class="good_price">￥{{item.goodsExtension.price}}</view>
			</view>
		</view> 
	</view>
</template>

<script>
	export default {
		props:{
			list: { // 数据列表
				type: Array,
				default(){
					return []
				}
			}
		},
		components: {},
		data() {
			return{}
		},
		methods:{
			goInfo(e){
				uni.navigateTo({
					url:'../../goods/goods-info/goods-info'
				})
			}
		}
	}
</script>

<style>
	/*数据列表*/
	.pd-li{
		position: relative;
		height:auto;
		width:94%;
		margin-left:3%;
		margin-bottom:10px;
	}
	.pd-li .pd-img{
		position: absolute !important; /*编译到H5,在list-mescroll-more的案例中需加上!important,解决tab切换过快定位失效的问题*/
		left: 36upx;
		top: 20upx;
		width: 160upx;
		height: 160upx;
	}
	.pd-li .pd-name{
		font-size: 26upx;
		line-height: 40upx;
		height: 80upx;
		margin-bottom: 20upx;
		overflow: hidden;
	}
	.pd-li .pd-price{
		font-size: 26upx;
		color: red;
	}
	.pd-li .pd-sold{
		font-size: 24upx;
		margin-left: 16upx;
		color: gray;
	}
	.goodItem {
		width: 100%;
		height: 120px;
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		border-bottom: 1px solid #EEEEEE;
	}
	
	.good_img {
		width: 100px;
		height: 100px;
		float:left;
		background-color: #F1F8FF;
		margin: 10px;
		
	}
	.imgSize{
		width:100%;
		height:100%;
		float:left;
		
	}
	
	.good_info {
		width: 60%;
		flex-wrap: wrap;
	}
	
	.good_tittle {
		width: 100%;
		height:auto;
		float:left;
		margin-top: 13px;
		font-size: 14px;
		font-family: PingFangSC-Regular, PingFangSC;
		font-weight: 400;
		color: rgba(51, 51, 51, 1);
		line-height: 20px;
	}
	
	.good_price {
		margin-top: 6px;
		width: 100%;
		height: 20px;
		float:left;
		font-size: 14px;
		font-family: PingFangSC-Medium, PingFangSC;
		font-weight: 500;
		color: rgba(255, 97, 14, 1);
		line-height: 20px;
	}
</style>
